From a865df6eb042bb305d2f880386fd6d9e5551ec4d Mon Sep 17 00:00:00 2001
From: Adam Soltys <asoltys@gmail.com>
Date: Mon, 13 Mar 2023 00:44:43 -0700
Subject: payments page formatting

---
 .../[username]/payments/[...page]/+page.svelte     | 32 +++++++++++-----------
 1 file changed, 16 insertions(+), 16 deletions(-)

(limited to 'src/routes/(app)/[username]')

diff --git a/src/routes/(app)/[username]/payments/[...page]/+page.svelte b/src/routes/(app)/[username]/payments/[...page]/+page.svelte
index a502f8c3..84891b92 100644
--- a/src/routes/(app)/[username]/payments/[...page]/+page.svelte
+++ b/src/routes/(app)/[username]/payments/[...page]/+page.svelte
@@ -60,9 +60,11 @@
 		payments = payments.map((p) => ({
 			...p,
 			created: new Date(p.created),
+			total: p.amount + p.tip || 0,
 			amount_fiat: f((p.amount * p.rate) / sats, p.currency),
 			fee_fiat: p.fee ? f((p.fee * p.rate) / sats, p.currency) : null,
-			tip_fiat: p.tip ? f((p.tip * p.rate) / sats, p.currency) : null
+			tip_fiat: p.tip ? f((p.tip * p.rate) / sats, p.currency) : null,
+			total_fiat: f(((p.amount + p.tip || 0) * p.rate) / sats, p.currency)
 		}));
 
 		let keys = [
@@ -72,11 +74,13 @@
 			'rate',
 			'currency',
 			'amount',
-			'fee',
 			'tip',
+			'total',
+			'fee',
 			'amount_fiat',
-			'fee_fiat',
-			'tip_fiat'
+			'tip_fiat',
+			'total_fiat',
+			'fee_fiat'
 		];
 
 		let csv =
@@ -143,24 +147,20 @@
 				<a href={`/payment/${p.id}`}>
 					<div class="grid grid-cols-3 border-b h-24 hover:bg-gray-100 px-4">
 						<div class="whitespace-nowrap my-auto">
-							<div class="font-bold">
-								{f(p.amount * (p.rate / sats), p.currency)}
-
+              <div class="font-bold" class:text-red-800={p.amount < 0}>
+								{f((Math.abs(p.amount) + p.tip || 0) * (p.rate / sats), p.currency)}
 								{#if p.tip}
-									<span class="text-sm">
-										+{f(p.tip * (p.rate / sats), p.currency)}
+									<span class="text-xs text-secondary">
+										{f(Math.abs(p.amount) * (p.rate / sats), p.currency)} + {f(
+											p.tip * (p.rate / sats),
+											p.currency
+										)}
 									</span>
 								{/if}
 							</div>
 
 							<div class="text-secondary">
-								{sat(p.amount)}
-
-								{#if p.tip}
-									<span class="text-sm">
-										+{sat(p.tip)}
-									</span>
-								{/if}
+								{sat(p.amount + p.tip)}
 							</div>
 						</div>
 
-- 
cgit v1.2.3